<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/aui.2.0.css" />
    <style type="text/css">
        .spinner {
          margin: 100px auto 0;
          width: 150px;
          text-align: center;
        }
         
        .spinner > div {
          width: 15px;
          height: 15px;
          background-color: #ffffff;
         
          border-radius: 100%;
          display: inline-block;
          -webkit-animation: bouncedelay 1.4s infinite ease-in-out;
          animation: bouncedelay 1.4s infinite ease-in-out;
          /* Prevent first frame from flickering when animation starts */
          -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
        }
         
        .spinner .bounce1 {
          -webkit-animation-delay: -0.32s;
          animation-delay: -0.32s;
        }
         
        .spinner .bounce2 {
          -webkit-animation-delay: -0.15s;
          animation-delay: -0.15s;
        }

        .spinner .bounce3 {
          -webkit-animation-delay: -0.02s;
          animation-delay: -0.02s;
        }
         
        @-webkit-keyframes bouncedelay {
          0%, 80%, 100% { -webkit-transform: scale(0.0) }
          40% { -webkit-transform: scale(1.0) }
        }
         
        @keyframes bouncedelay {
          0%, 80%, 100% {
            transform: scale(0.0);
            -webkit-transform: scale(0.0);
          } 40% {
            transform: scale(1.0);
            -webkit-transform: scale(1.0);
          }
        }
    </style>
</head>
<body style="text-align: center; background-color: #03A9F4;">
    <div class="spinner" id="loading">
        <div class="bounce1"></div>
        <div class="bounce2"></div>
        <div class="bounce3"></div>
    </div>
    <img src="./launch/launch1080x1920.png" style="max-height:100%; max-width:100%;">
</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript">
    var user = {uid: 0};
    apiready = function(){
        api.setStatusBarStyle({
            style: 'light'
        });
        api.parseTapmode();

        //加载动画定位
        $api.byId('loading').style.position = 'fixed';
        $api.byId('loading').style.top = (api.winHeight * 0.60 - 80) + 'px';
        $api.byId('loading').style.left = ((api.winWidth - 150) / 2) + 'px';

        //登录成功监听
        api.addEventListener({
            name: 'xxjzLogin'
        }, function(ret, err){
            if( ret ){
                //alert( JSON.stringify( ret ) );
                openWin('index_win');
            }else{
                //alert( JSON.stringify( err ) );
                LoginFrame();
            }
        });

        //退出登录监听
        api.addEventListener({
            name: 'xxjzLogout'
        }, function(ret, err){
            LoginFrame();
        });

        //主流程
        user = $api.getStorage('user');
        if (user && (user.uid > 0)) {
            AutoLogin(user);
        } else {
            LoginFrame();
            closeLaunch();
        }       
    };

    /** 自动登录 */
    function AutoLogin(user) {
        var uid = user.uid;
        var username = user.username;
        var password = user.password;
        if (uid && username && password) {
            sendPostLogin(username, password, function(ret){
                if (ret['uid'] > 0) {
                    //发送登录成功事件
                    api.sendEvent({
                        name: 'xxjzLogin',
                        extra: {
                            uid: ret['uid'], 
                            username: username,
                            password: password
                        }
                    });
                } else {
                    api.alert({
                        title: '登录失败',
                        msg: ret['uname']
                    },function(){
                        LoginFrame();
                    });
                }
                closeLaunch();
            });
        }
    }

    /** 发送登录Post请求 */
    function sendPostLogin(username, password, callback) {
        api.ajax({
            url: 'http://qxu1192050221.my3w.com/xxjzApp/index.php/Home/Login/login_api',
            method: 'post',
            data: {
                values: { 
                    username: username,
                    password: password,
                    submit: 'xxjzAUI'
                }
            }
        },function(ret, err){
            if (ret) {
                callback(ret);
            } else {
                callback({
                    uid: user.uid,
                    uname: err['msg']+'（请联系管理员）'
                });
            }
        });
    }

    /** 打开登录页面 */
    function LoginFrame() {
        api.openFrame({
            name: 'login_frm',
            url: './html/login_frm.html',
            bounces: false,
            reload: true,
            softInputMode: 'pan',
            rect: {
                x: 0,
                y: 0,
                w: 'auto',
                h: 'auto'
            }
        })
        api.closeToWin({
            name: 'root',
            animation: {
                type: 'reveal',
                subType:"from_bottom",
                duration: 400 
            }
        });
    }

    /** 打开指定窗体 */
    function openWin(name){
        api.openWin({
            name: ''+name+'',
            url: './html/'+name+'.html',
            bounces:false,
            delay: 400,
            slidBackEnabled:false,
            vScrollBarEnabled:false,
            animation: {
                type: 'fade'
            }
        });
    }

    /** 关闭正在活动的窗体 */
    function closeWin(){
        api.closeWin({
        });
    }

    /** 关闭启动页面 */
    function closeLaunch() {
        api.removeLaunchView({
            // animation: {
            //     type: 'suck',
            //     duration: 500
            // }
        });
    }
</script>
</html>